<!DOCTYPE html>
<html lang="en">
<head>
	<link rel="icon" type="image/png" href="{{base_url}}/images/logo.png">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{navSub.cate.name}}-Product Series-{{site.name}}</title>
    <link rel="stylesheet" href="{{base_url}}/css/Product.css">
<style>
	.productlist a{
		color: black;
	}
</style>
</head>
<body>
    {{include './common/header_en.html'}}
    <div class="banner">
        <img src="{{base_url}}/images/image7.png" alt="">
    </div>
    <div class="brand">
        <div class="left">
            <h2>Product Series</h2>
            <ul>
                {{if navSub.cate.pinyin == 'tuijianchanpin'}}
                	<li class="btn1"><a style="color:blue" href="/chanpinxilie/tuijianchanpin/enindex.html">Recommended Products</a></li>
                	{{else}}
					<li class="btn1"><a href="/chanpinxilie/tuijianchanpin/enindex.html">Recommended Products</a></li>
                {{/if}}
                {{if navSub.cate.pinyin == 'baoxianlicai'}}
                	<li class="btn2"><a style="color:blue" href="/chanpinxilie/baoxianlicai/enindex.html">Insurance and Financial Planning</a></li>
                	{{else}}
					<li class="btn2"><a href="/chanpinxilie/baoxianlicai/enindex.html">Insurance and Financial Planning</a></li>
                {{/if}}
                {{if navSub.cate.pinyin == 'yinxinglicai'}}
                	<li class="btn3"><a style="color:blue" href="/chanpinxilie/yinxinglicai/enindex.html">Banking and Financial Services</a></li>
                	{{else}}
					<li class="btn3"><a href="/chanpinxilie/yinxinglicai/enindex.html">Banking and Financial Services</a></li>
                {{/if}}
                {{if navSub.cate.pinyin == 'shuweizichan'}}
                	<li class="btn4"><a style="color:blue" href="/chanpinxilie/shuweizichan/enindex.html">Digital Assets</a></li>
                	{{else}}
					<li class="btn4"><a href="/chanpinxilie/shuweizichan/enindex.html">Digital Assets</a></li>
                {{/if}}
                {{if navSub.cate.pinyin == 'zhihuijinrong'}}
                	<li class="btn4"><a style="color:blue" href="/chanpinxilie/zhihuijinrong/enindex.html">Smart Finance</a></li>
                	{{else}}
					<li class="btn4"><a href="/chanpinxilie/zhihuijinrong/enindex.html">Smart Finance</a></li>
                {{/if}}
                {{if navSub.cate.pinyin == 'jiazucaifu'}}
                	<li class="btn4"><a style="color:blue" href="/chanpinxilie/jiazucaifu/enindex.html">Family Wealth</a></li>
                	{{else}}
					<li class="btn4"><a href="/chanpinxilie/jiazucaifu/enindex.html">Family Wealth</a></li>
                {{/if}}
            </ul>
        </div>
        <div class="right">
            <div class="brand_item1">
                <p>>{{each position}}
                	{{if $index < position.length-1}}
                		<a href="{{$value.path}}/index.html">{{$value.name_en}}</a> >
                		{{else}}
                		<a  href="{{$value.path}}/index.html">{{$value.name_en}}</a>
                	{{/if}}
                {{/each}}</p>
				
                <h2>{{navSub.cate.name_en}}</h2>
                <div>
					<p style="margin: 40px 0;">
						Anshou investment fund project products are divided into five major sections, insurance financial management, bank financial management, smart financial services, family wealth management, and financial technology industry investment. Project income is divided into five major income forms, current income, regular income, cyclical income, and smart income. Financial income, specific parameter income.
					</p>
				</div>
				<div class="productlist" style="display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start;margin-bottom: 10px;">
					{{if data.list.length>0}}
						{{each data.list}}
						
						<div class="brand_item1_kuang" style="margin-top:10px;">
							<a href="{{$value.path}}/enarticle-{{$value.id}}.html" title="{{$value.title_en}}">
							<img src="{{base_url}}/images/pro1.png" alt="" class="brand_item1_kuangimg">
							<h3>{{$value.title_en}}</h3>
							<p class="brand_item1_kuangte" >
								{{$value.taglist_en}}
							</p>
							<div  class="brand_item1_kuangxia">
								{{@ $value.description_en}}
							</div>
							</a>
						</div>
						{{/each}}
					{{/if}}
				</div>
				
				{{if data.list.length>1}}
				<style>
					.pagenum{
						width: 100%;
						display: flex;
						flex-wrap: nowrap;
						justify-content: center;
						color: black;
						margin-top: 10px;
						margin-bottom: 10px;
					}
					.pagenum li{
						margin-left: 20px;
						color: black;
					}
				</style>
				
				<ul class="pagenum" style="margin-top: 10px;">
					{{@ pageHtml}}
				</ul>
				{{/if}}
				
            </div>
			
            
        </div>
    </div>
    {{include './common/footer_en.html'}}
</body>
<script>
    document.querySelector('header').addEventListener('mouseover', function() {
        document.querySelector('.submenu').style.display = 'block';
    });

    document.querySelector('header').addEventListener('mouseout', function() {
        document.querySelector('.submenu').style.display = 'none';
    });
</script>
<script>
    var btn1 = document.querySelector(".btn1");
    var btn2 = document.querySelector(".btn2");
    var btn3 = document.querySelector(".btn3");
    var btn4 = document.querySelector(".btn4");
    var btn5 = document.querySelector(".btn5");
    btn1.onclick = function(){
        var brand_item1 = document.querySelector('.brand_item1').style.display = 'block';
        var brand_item2 = document.querySelector('.brand_item2').style.display = 'none';
        var brand_item3 = document.querySelector('.brand_item3').style.display = 'none';
        var brand_item4 = document.querySelector('.brand_item4').style.display = 'none';
        var brand_item5 = document.querySelector('.brand_item5').style.display = 'none';
    }
    // btn2.onclick = function(){
    //     var brand_item1 = document.querySelector('.brand_item1').style.display = 'none';
    //     var brand_item2 = document.querySelector('.brand_item2').style.display = 'block';
    //     var brand_item3 = document.querySelector('.brand_item3').style.display = 'none';
    //     var brand_item4 = document.querySelector('.brand_item4').style.display = 'none';
    //     var brand_item5 = document.querySelector('.brand_item5').style.display = 'none';
    // }
    // btn3.onclick = function(){
    //     var brand_item1 = document.querySelector('.brand_item1').style.display = 'none';
    //     var brand_item2 = document.querySelector('.brand_item2').style.display = 'none';
    //     var brand_item3 = document.querySelector('.brand_item3').style.display = 'block';
    //     var brand_item4 = document.querySelector('.brand_item4').style.display = 'none';
    //     var brand_item5 = document.querySelector('.brand_item5').style.display = 'none';
    // }
    // btn4.onclick = function(){
    //     var brand_item1 = document.querySelector('.brand_item1').style.display = 'none';
    //     var brand_item2 = document.querySelector('.brand_item2').style.display = 'none';
    //     var brand_item3 = document.querySelector('.brand_item3').style.display = 'none';
    //     var brand_item4 = document.querySelector('.brand_item4').style.display = 'block';
    //     var brand_item5 = document.querySelector('.brand_item5').style.display = 'none';
    // }
    // btn5.onclick = function(){
    //     var brand_item1 = document.querySelector('.brand_item1').style.display = 'none';
    //     var brand_item2 = document.querySelector('.brand_item2').style.display = 'none';
    //     var brand_item3 = document.querySelector('.brand_item3').style.display = 'none';
    //     var brand_item4 = document.querySelector('.brand_item4').style.display = 'none';
    //     var brand_item5 = document.querySelector('.brand_item5').style.display = 'block';
    // }
</script>
</html>